<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="shortcut icon" href="__STATIC__/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="__STATIC__/css/font.css">
    <link rel="stylesheet" href="__STATIC__/css/xadmin.css">
    <link rel="stylesheet" href="__STATIC__/css/one.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="__STATIC__/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="__STATIC__/js/xadmin.js"></script>

    <script src="https://cdn.bootcss.com/jquery/2.1.4/jquery.js"></script>

    <link rel="stylesheet" href="__STATIC__/editor/themes/default/default.css" />
    <style type="text/css">
        .hide{
            display: none;
        }
        show{
            display: block;
        }
    </style>
    <script type="text/javascript" src="__STATIC__/editor/kindeditor.js"></script>
    <script src="__STATIC__/editor/lang/zh_CN.js"></script>
</head>
<body>
<form class="layui-form" id="form1">
    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
        <div class="layui-tab-content">
                <div class="layui-row">
                    <div class="layui-col-md7">
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red"></span>预约时间
                            </label>
                            <div class="layui-input-inline">
                                <input class="layui-input" value="" required placeholder="预约时间" name="work_time" id="work" lay-key="1">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red"></span>午休时间
                            </label>
                            <div class="layui-input-inline">
                                <input class="layui-input" value="" placeholder="午休时间" name="rest_time" id="rest" lay-key="1">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                日约总数
                            </label>
                            <div class="layui-input-inline">
                                <input type="text" name="count" required="" value=""
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                免费人数
                            </label>
                            <div class="layui-input-inline">
                                <input type="text" name="free_count" required="" value=""
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                收费人数
                            </label>
                            <div class="layui-input-inline">
                                <input type="text" name="pay_count" required="" value=""
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                <span class="x-red"></span>日时长
                            </label>
                            <div class="layui-input-inline">
                                <input type="text" name="shichang"  value=""
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                1-6教练
                            </label>
                            <div class="layui-input-inline" style="width:450px;">
                                <input checked lay-skin="primary" lay-filter="coach" type="checkbox" title="全选" value="" layui-fliter>
                                {volist name='coach' id='v'}
                                    <input name="coach[]" lay-skin="primary" type="checkbox" title="{$v.name}" value="{$v.id}">
                                {/volist}
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">
                                价格
                            </label>
                            <div class="layui-input-inline">
                                <input type="text" name="price" required="" value=""
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label  class="layui-form-label">
                    </label>
                    <button class="layui-btn" lay-filter="add" lay-submit="">
                        确认保存
                    </button>
                </div>

        </div>
    </div>
</form>
<script type="text/javascript">
    $('input[name^="coach"]').attr('checked',true);
    $('input[name^="kemu"]').attr('checked',true);
    layui.use(['form', 'layer','element','upload','laydate'], function () {
        $ = layui.jquery;
        var form = layui.form
            , element = layui.element
            , layer = layui.layer
            ,upload = layui.upload
            ,laydate = layui.laydate;
        form.on('select(myselect)',function(data){
            $('#kemu').val($('#cha option:checked').val());
        });
        //预约时间范围
        laydate.render({
            elem: '#work'
            ,type: 'time'
            ,range: true
        });
        //午休时间范围
        laydate.render({
            elem: '#rest'
            ,type: 'time'
            ,range: true
        });
        //科目全选
        form.on('checkbox(qx)',function(data){
            if(this.checked){
                $('input[name^="kemu"]').prop('checked',true);
            }else{
                $('input[name^="kemu"]').prop('checked',false);
            }
            form.render("checkbox");
        });
        //教练全选
        form.on('checkbox(coach)',function(data) {
            if (this.checked) {
                $('input[name^=coach]').prop('checked', true);
            } else {
                $('input[name^=coach]').prop('checked',false);
            }
            form.render("checkbox");
        });

        //监听提交
        form.on('submit(add)', function (data) {
            if($('input[name^=coach]:checked').length!=5){
                layer.msg('教练人数必须为5人', {icon: 5,time:1000});
                return false;
            }
            console.log("data",data.field);
            $.post('{:url("yuyue/yueyueaddform")}',data.field,function (res) {
                if (res.code == 1){
                    layer.msg(res.msg, {icon: 6,time:1000}, function () {
                        window.parent.location.reload();
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    });
                }else {
                    layer.msg(res.msg, {icon: 5,time:1000});
                }
            });
            return false;
        });
    });
</script>
</body>

</html>
